<template>
    <div id="apps">
            <router-view></router-view>
    </div>
</template>

<script>
    export default {
        name: "App",
        components: {
        },
        data() {
            return {
                openMenu: false,
            };
        },

        methods: {
            menuClickHandle() {
                this.openMenu = !this.openMenu;
            },
            closeDrawerHandle() {
                this.openMenu = false;
            }
        },
    };
</script>

<style>
    * {
        outline: none;
    }

    html,
    body {
        margin: 0;
        padding: 0;
    }

    .el-input__inner {
        padding-left: 0 !important;
        border: none !important;
        height: 30px !important;
        background-color: transparent !important;
    }

    .el-input__suffix {
        display: none !important;
    }
</style>

<style scoped>
    #apps {
        width: 100vw;
        height: 100%;
        display: flex;
        flex-direction: row;
    }

    .body {
        width: calc(100% - 320px);
		height: 100%;
		display: flex;
		flex-direction: column;
    }

    .topMenu {
        height: 64px;
        display: none;
        background-color: #ffffff;
        padding: 0 20px;
        border-bottom: 1px solid #ebebeb;
    }

    /* ipad */
    @media screen and (max-width: 1180px) {
        .leftMenu {
            display: none;
        }

        .topMenu {
            display: flex;
            align-items: center;
        }

        .body {
            width: 100%;
        }
    }
</style>